<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="../js/vue.js" ></script>
    <script type="text/javascript" src="../js/axios.min.js" ></script>
    <!--导入样式-->
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <!--导入组件-->
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
</head>
<body>
<div id="app">
    <!--搜索表单-->
    <el-row>
        <el-form :inline="true" :model="searchForm" class="demo-form-inline">

            <el-form-item label="日期" >

                <span class="demonstration">年</span>
                 <el-date-picker
                        v-model="value6"
                        type="year"
                        placeholder="选择年"
                        :picker-options="pickerOptions1"
                        @change="dateChange"
                        format="yyyy" value-format="yyyy">
                </el-date-picker>

            </el-form-item>

            <el-form-item>
                <el-button type="primary" icon="search" @click="searchClick">查询</el-button>
                <el-button type="success" icon="plus" @click="addClick">新增</el-button>
            </el-form-item>
        </el-form>
    </el-row>



</div>
</body>
<script >
    var  app =new Vue({
        el:"#app",
        data:{
            pickerOptions1: {
                disabledDate(time) {
                    return time.getTime() > Date.now();
                }
            },
            yearname: '',
            value6: '',
            options:[{
                options:""

            }],value:'',
            //列表数据
            tableData: [],
            //多选值
            multipleSelection: [],
            //显示加载中样式
            loading:false,
            //搜索表单
            searchForm: {
                year: '',
                tname:""
            },
            //当前页
            currentPage:1,
            //分页大小
            pageSize:10,
            //总记录数
            total:800,
            //删除的弹出框
            deleteVisible:false,
            //编辑界面是否显示
            editFormVisible: false,
            editLoading: false,
            goUrl:'',
            editFormRules: {
                ename: [
                    { required: true, message: '请输入姓名', trigger: 'blur' }
                ]
            },
            //编辑界面数据
            editForm: {
                id:"",
                tname: "",
                yid:"",
                yearname:""
            },
        },
        created:function(){

            /*  var self = this;
              var start =(this.currentPage-1)*this.pageSize;
              var end =this.currentPage*this.pageSize+1;
              axios.post('/neirong/list',{'start':start,'pageSize':this.pageSize}).then(function(response){
                  // console.log(response.data);
                  //alert(response.data.total);
                  self.total=response.data.total;
                  self.tableData = response.data.data;
                 self.options = response.data.options;
                  // self.multipleSelection=response.data.data;
              })*/
            var self=this;
            self.loadingData();
        },
        methods:{
            //表格重新加载数据
            loadingData:function() {
                var _self = this;
                _self.loading = true;
                //var self = this;
                //alert("1");
                var start =(this.currentPage-1)*this.pageSize;
                var end =this.currentPage*this.pageSize+1;
                var searchForm={'start':start,'pageSize':this.pageSize,'year':_self.value6,'tname':_self.editForm.tname1};
                //alert(JSON.stringify(searchForm));
                axios.post('/neirong/list',{'start':start,'pageSize':this.pageSize,'year':_self.value6,'tname':_self.editForm.tname1}).then(function(response){
                    // console.log(response.data);
                    //alert(response.data.total);
                    _self.total=response.data.total;
                    _self.tableData = response.data.data;
                    // alert(JSON.stringify(response.data.data))
                    _self.options = response.data.options;
                    // self.multipleSelection=response.data.data;
                })
                console.log(_self.currentPage);
                setTimeout(function(){
                    console.info("加载数据成功");
                    _self.loading = false;
                },300);
            },
            //表格查询事件
            searchClick:function() {
                var self=this;
                self.loadingData();
            },
            //分页大小修改事件
            pageSizeChange:function(val) {
                console.log('每页 ' + val +' 条');
                this.pageSize = val;
                var _self = this;
                _self.loadingData();//重新加载数据
            },
            //当前页修改事件
            currentPageChange:function(val) {
                this.currentPage = val;
                console.log('当前页: ' + val);
                var _self = this;
                _self.loadingData();//重新加载数据
            },//表格删除事件
            deleteClick:function(row) {

                var _self = this;
                //alert(_self);
                this.$confirm('确认当前操作吗？', '提示', {

                    type: 'warning'
                }).then(function(){

                    var  url="/neirong/del?id="+row.id;// "emp/del/1"
                    //  var  url="/yuangong/del/"+row.id;// "emp/del/1"
                    axios.get(url).then(function (response) {
                        //alert(response.data);
                        if(response.data>0){//接受参数
                            _self.$message({
                                message: row.id + '删除成功',
                                type: 'success'
                            });
                            _self.loadingData();//重新加载数据
                        }
                    });
                }).catch(function(e){
                    if(e != "cancel")
                        console.log("出现错误：" + e);
                });
            },
            //删除所选，批量删除
            removeSelection:function() {
                var _self = this;
                var multipleSelection = this.multipleSelection;
                if(multipleSelection.length < 1) {
                    _self.$message({
                        message: '请至少选中一条记录',
                        type: 'error'
                    });
                    return;
                }
                var ids = "";
                for(var i=0;i<multipleSelection.length;i++) {
                    var row = multipleSelection[i];
                    ids += row.id + ","
                }
                this.$confirm('确认删除' + ids +'吗?', '提示', {
                    type: 'warning'
                }).then(function(){
                    var  url="/neirong/batchDel?ids="+ids;
                    axios.get(url).then(function (response) {
                        //alert(response.data);
                        var temp="";
                        if(response.data>0){
                            temp="删除成功";
                        }else {
                            temp="删除失败";
                        }
                        _self.$message({
                            message: ids + temp,
                            type: 'success'
                        });
                        _self.loadingData();//重新加载数据
                    });

                }).catch(function(e){
                    if(e != "cancel")
                        console.log("出现错误：" + e);
                });
            },

            //表格编辑事件
            editClick:function(row) {
                this.goUrl="/neirong/update";
                this.editFormVisible = true;

                this.editForm = Object.assign({}, row);
                //alert(JSON.this.editForm);
            },
            addClick:function() {
                //alert(111);
                this.goUrl="/neirong/add";
                var _self = this;
                this.editForm={id:0,yearname:"", tname:"", content:"", score:"", cldetailed:"", clrequest:"", standard:""}
                this.editFormVisible = true;//弹出层，让隐藏的弹出层显示
                _self.loadingData();//重新加载数据
            },
            //保存点击事件
            editSubmit:function(){
                var _self = this;
                _self.loading = true;
                var formData =this.editForm;
                //alert(formData);
                var goUrl=this.goUrl;
                //alert(goUrl);
                //alert(JSON.stringify(formData));
                // axios.post("/emp/add",{"ename":this.editForm.ename,"job":this.editForm.job}).then(function(response){
                axios.post(goUrl,formData).then(function(response){
                    // console.log(response.data);
                    // alert(222);
                    // self.total=response.data.total;
                    if(response.data>0){
                        _self.editFormVisible = false;// 让弹出层隐藏
                        _self.loadingData();//重新加载数据
                    }
                })
                console.info(this.editForm);
            },qingkong:function(){

                this.editForm.name=null;
                this.editForm.yearname=null;
            }


        }

    })

</script>
</html>